import { Input } from 'ant-design-vue'

export default {
  name: 'ProFieldText',
  props: {
    text: [Number, String, Object],
    mode: {
      type: String,
      default: 'read',
      validator: v => ['read', 'edit', 'custom'].includes(v)
    },
    emptyText: {
      type: String,
      default: '-'
    },
    fieldProps: Object
  },
  render() {
    let dom

    if (this.mode === 'read') {
      dom = <span>{ this.fieldProps?.prefix ?? '' }{ this.text ?? this.emptyText }{ this.fieldProps?.suffix ?? '' }</span>
    } else if (this.mode === 'edit') {
      dom = <Input placeholder="请输入" { ...this.fieldProps } />
    } else if (this.mode === 'custom') {
      dom = this.$slots?.default
    }

    return dom
  }
}
